<template>
  <div>
    <van-nav-bar title="用户资料" left-text="返回" left-arrow @click-left="$router.go(-1)"/>
    <br/>
    <van-form colon @submit="onSubmit">
      <van-cell-group inset :border="false">
        <van-field v-model="form.username" readonly name="username" label="账号" placeholder="请输入账号"
                   :rules="[{ required: false }]"/>
        <van-field v-model="form.nickname" name="nickname" label="昵称" placeholder="请输入昵称"
                   :rules="[{ required: false }]"/>
        <br/>
        <van-cell :border="false">
          <van-button round block type="info" native-type="submit">提交</van-button>
        </van-cell>
      </van-cell-group>
    </van-form>
  </div>
</template>

<script>
import {Notify} from 'vant'

export default {
  computed: {
    userInfo() {
      return this.$store.state.userInfo
    }
  },
  data() {
    return {
      form: {
        username: null,
        nickname: null
      }
    };
  },
  methods: {
    load() {
      this.$requests.post('/user/info/obtain').then(resp => {
        this.form = resp
      })
    },
    onSubmit(form) {
      this.$requests.post('/user/info/update', form).then(resp => {
        if (resp.n) {
          Notify({type: 'success', message: '修改成功'})
        }
      })
    },
  },
  mounted() {
    this.load()
  }
}
</script>

